<template>
	<view class="page">
		<uv-navbar :title="tabbarList[value].title" :fixed="false" v-if="!tabbarList[value].hiddenTit">
			<template slot="left"></template>
		</uv-navbar>
		<scroll-view scroll-y="true" class="scroll-view" :style="{top: tabbarList[value].hiddenTit ? 0 : navH, bottom: tabbarH + 'px' }">
			<view>
				<tab1 v-if="value === 0" @toUser="value = 3" />
				<tab2 v-if="value === 1" @goHome="value = 0" @toUser="value = 3" />
				 <tab4 v-if="value === 3" @goHome="value = 0" />
			</view>
		</scroll-view>

		<uv-tabbar :value="value" @change="index=>value = index" activeColor="#f08505" fixed @tabBarH="updateHeight">
			<uv-tabbar-item  v-for="item in tabbarList" :key="item.title" :text="item.title" v-if="item.title !== '在线客服'">
				<image class="tabbar-icon" :src="item.icon" mode="aspectFit" slot="inactive-icon"></image>
				<image class="tabbar-icon" :src="item.actIcon" mode="aspectFit" slot="active-icon"></image>
			</uv-tabbar-item>
			<button v-else  open-type="contact" class="kf-btn" >
				<uv-tabbar-item  :key="item.title" :text="item.title">
					<image class="tabbar-icon" :src="item.icon" mode="aspectFit" slot="inactive-icon"></image>
					<image class="tabbar-icon" :src="item.actIcon" mode="aspectFit" slot="active-icon"></image>
				</uv-tabbar-item>
			</button>
		</uv-tabbar>
	</view>
</template>

<script>
	import tab1 from './index copy.vue'
	import tab2 from '../yyzx/yyzx.vue'
	import tab4 from '../userinfo/userinfo.vue'
	export default {
		onShareAppMessage() {
			const userinfo = JSON.parse(uni.getStorageSync('userinfo'))
			return {
				title: '预约咨询',
				path: 'pages/index/index?scene=' + userinfo.inviteCode, // 分享页面的路径
				imageUrl: '/static/banner.jpg', // 分享图片的链接
			};
		},
		watch: {
			value(num, old) {
				// if(num === 1) {
				// 	uni.navigateTo({
				// 		url: '/pages/yyzx/yyzx'
				// 	})
				// 	this.value = old
				// }
				// if(num === 3) {
				// 	uni.navigateTo({
				// 		url: '/pages/userinfo/userinfo'
				// 	})
				// 	this.value = old
				// }
			}
		},
		components: {
			tab1, tab2, tab4
		},
		onLoad(data) {
			uni.setStorageSync('inviteCode', data.scene || '')
		},
		data() {
			return {
				navH: uni.getSystemInfoSync().statusBarHeight + 44 + 'px',
				value: 0,
				tabbarH: 50,
				tabbarList: [{
						title: '首页',
						icon: '/static/home.png',
						actIcon: '/static/homeact.png',
						hiddenTit: true,
					},
					{
						title: '纸上良宸',
						icon: '/static/zx.png',
						actIcon: '/static/zxact.png',
					},
					{
						title: '在线客服',
						icon: '/static/kefu.png',
						actIcon: '/static/kefuact.png',
					},
					{
						title: '我的',
						icon: '/static/yq.png',
						actIcon: '/static/yqact.png',
						hiddenTit: true,
					},
				]
			}
		},
		methods: {
			updateHeight(_tabbarH) {
				this.tabbarH = _tabbarH
			},
			test() {
				console.log(123)
			}
		}
	}
</script>

<style scoped lang="scss">
	.page {
		position: relative;
	}
	.scroll-view {
		position: fixed;
		top: 64px;
		left: 0;
		right: 0;
		bottom: 50px;
		background-color: #fff;
	}
	.tabbar-icon {
		width: 50upx;
		height: 50upx;
	}

	.kf-btn {
		background-color: transparent;
		line-height: 22px;
	}

	.kf-btn::after {
		border: none;
	}
</style>